﻿@using Microsoft.AspNetCore.Components
@using Microsoft.AspNetCore.Http
@using Radzen.Blazor
@inherits LayoutComponentBase
@inject ThemeState ThemeState
@inject NavigationManager UriHelper
@inject IJSRuntime JSRuntime
@inject IHttpContextAccessor httpContextAccessor

@if (Theme != "standard.css")
{
    <link href="_content/Radzen.Blazor/css/@(Theme)" rel="stylesheet" />
}
<RadzenLayout>
<RadzenHeader>
    <ChildContent>
        <div class="row justify-content-start align-items-center">
            <div class="col-5 d-flex align-items-center">
               <RadzenSidebarToggle Click="@(args => { sidebarExpanded = !sidebarExpanded; bodyExpanded = !bodyExpanded; })">
                </RadzenSidebarToggle>
                <RadzenLabel Text="Radzen Blazor Components">
                </RadzenLabel>
            </div>
            <div class="col-7 d-flex align-items-center justify-content-end">
                <div class="d-none d-md-inline-flex align-items-center">
                    <a href="/docs/" title="Radzen Blazor Components Documentation" class="mx-2 mx-lg-3" target="_blank">Documentation</a>
                    <a href="https://www.radzen.com/" title="Create .NET Core web applications fast & easy" class="text-nowrap mx-2 mx-lg-3" target="_blank">About Radzen</a>
                </div>
                <RadzenDropDown class="mx-0 mx-lg-3" TValue="string" TextProperty="Text" ValueProperty="Value" Data="@themes" Value="@ThemeState.CurrentTheme" Change="@ChangeTheme" />
                <a href="https://github.com/radzenhq/radzen-blazor" title="GitHub" target="_blank" class="mx-3">
                    <svg width="24" height="24" viewBox="0 0 512 499.36" xmlns="http://www.w3.org/2000/svg">
                    <title>GitHub</title>
                    <path fill="black" fill-rule="evenodd" d="M256 0C114.64 0 0 114.61 0 256c0 113.09 73.34 209 175.08 242.9 12.8 2.35 17.47-5.56 17.47-12.34 0-6.08-.22-22.18-.35-43.54-71.2 15.49-86.2-34.34-86.2-34.34-11.64-29.57-28.42-37.45-28.42-37.45-23.27-15.84 1.73-15.55 1.73-15.55 25.69 1.81 39.21 26.38 39.21 26.38 22.84 39.12 59.92 27.82 74.5 21.27 2.33-16.54 8.94-27.82 16.25-34.22-56.84-6.43-116.6-28.43-116.6-126.49 0-27.95 10-50.8 26.35-68.69-2.63-6.48-11.42-32.5 2.51-67.75 0 0 21.49-6.88 70.4 26.24a242.65 242.65 0 0 1 128.18 0c48.87-33.13 70.33-26.24 70.33-26.24 14 35.25 5.18 61.27 2.55 67.75 16.41 17.9 26.31 40.75 26.31 68.69 0 98.35-59.85 120-116.88 126.32 9.19 7.9 17.38 23.53 17.38 47.41 0 34.22-.31 61.83-.31 70.23 0 6.85 4.61 14.81 17.6 12.31C438.72 464.97 512 369.08 512 256.02 512 114.62 397.37 0 256 0z"></path>
                    </svg>
                </a>
            </div>
        </div>
    </ChildContent>
</RadzenHeader>
<RadzenBody>
    <ChildContent>
        <RadzenContentContainer Name="main">
            <div class="container-fluid">
                <div class="row">
                    <div class="col-12 pt-4 pb-5 px-3 px-lg-5">
                        @Body
                    </div>
                </div>
            </div>
        </RadzenContentContainer>
    </ChildContent>
</RadzenBody>
<RadzenSidebar @ref="@sidebar0" @bind-Expanded="@sidebarExpanded">
    <ChildContent>
        <div style="padding: 1rem">
            <RadzenTextBox Placeholder="Find component ..." type="search" style="width: 100%" />
        </div>
    <RadzenPanelMenu>
            <RadzenPanelMenuItem Text="主页" Path="/" Icon="home">
            </RadzenPanelMenuItem>      
            <RadzenPanelMenuItem Text="用户管理" Icon="save">
                <RadzenPanelMenuItem Text="用户信息" Path="user" Icon="account_circle"></RadzenPanelMenuItem> 
                <RadzenPanelMenuItem Text="FetchData" Path="fetchdata" Icon="attach_file"></RadzenPanelMenuItem>
            </RadzenPanelMenuItem>      
            <RadzenPanelMenuItem Text="投票管理" Icon="account_balance">
                <RadzenPanelMenuItem Text="Counter" Path="votes" Icon="account_circle"></RadzenPanelMenuItem>
            </RadzenPanelMenuItem>     
    </RadzenPanelMenu>
    </ChildContent>
</RadzenSidebar>
</RadzenLayout>

@code {
    RadzenSidebar sidebar0;
    RadzenBody body0;
    bool sidebarExpanded = true;
    bool bodyExpanded = false;

    dynamic themes = new[]
    {
        new { Text = "Default Theme", Value = "default"},
        new { Text = "Dark Theme", Value="dark" },
        new { Text = "Software Theme", Value = "software"},
        new { Text = "Humanistic Theme", Value = "humanistic" },
        new { Text = "Standard Theme", Value = "standard" }
    };

    string Theme
    {
        get
        {
            return $"{ThemeState.CurrentTheme}.css";
        }
    }

    protected override void OnInitialized()
    {
        if (httpContextAccessor != null && httpContextAccessor.HttpContext != null &&
             httpContextAccessor.HttpContext.Request != null && httpContextAccessor.HttpContext.Request.Headers.ContainsKey("User-Agent"))
        {
            var userAgent = httpContextAccessor.HttpContext.Request.Headers["User-Agent"].FirstOrDefault();
            if (!string.IsNullOrEmpty(userAgent))
            {
                if (userAgent.Contains("iPhone") || userAgent.Contains("Android") || userAgent.Contains("Googlebot"))
                {
                    sidebarExpanded = false;
                    bodyExpanded = true;
                }
            }
        }

        System.Threading.Thread.CurrentThread.CurrentCulture = new System.Globalization.CultureInfo("en-US");
    }

    void ChangeTheme(object value)
    {
        ThemeState.CurrentTheme = value.ToString();
        UriHelper.NavigateTo(UriHelper.ToAbsoluteUri(UriHelper.Uri).ToString());
    }
}